* {
    margin: 0;
    padding: 0;
    list-style: none;
}

#main {
    display: flex;
    margin: 60px auto;
    width: 350px;
    height: 550px;
    background-color: pink;
    flex-wrap: wrap;
    border-radius: 25px 25px;

    .head {
        width: 100%;
        height: 40%;

        .title {
            margin-top: 20px;
            width: 100%;
            height: 20%;
            line-height: 44px;
            text-align: center;
            font-size: 25px;
            // background-color: powderblue;
        }

        img {
            display: block;
            margin: auto;
            margin-top: 20px;
            width: 130px;
            height: 130px;
            border-radius: 50%
        }
    }

    .bady {
        .head;
        
        // transform: translateY(30px);
        div{
            position: absolute;
            // float: left;
        // margin-top: 30px;
        overflow: hidden;
            width: 350px;
            height: 220px;
            // transition: 0.3s;
            :nth-child(3){
                font-size: 25px;
            }
            :nth-child(4){
                font-size: 25px;
            }
        }

        i {
            @a: 30%;
            @b: 70%;
            @c: 100%;
            display: block;
            position: absolute;
            z-index: 1;
            // float: left;
            width: 350px;
            height: 220px;
            // background-color: springgreen;
            background: linear-gradient(rgba(255, 192, 203, 1)0%,
                    rgba(255, 192, 203, 0)@a,
                    rgba(255, 192, 203, 0)@b,
                    rgba(255, 192, 203, 1)@c,

                );
            // transform: translateY(-30px);
        }

        p {
            height: 32px;
            text-align: center;
            line-height: 32px;
            // transition: 0.5s;
        }
    }

    .foot {
        .head;
        display: flex;

        height: 20%;

        audio {
            margin: auto;
        }
    }
}

.color {
    color: snow;
}